import React, { Component } from 'react';
import Header from './components/Header';
import Home from './components/Home';
import Page from './components/Page';
import Table from './components/Table';
import Scroll from './components/Scroll';

class App extends Component {
  constructor() {
    super()
    this.state = {
      title: '哈哈哈'
    }
  }
  onchangeTitle(newtitle) {
    this.setState({
      title: newtitle
    })
  }
  render() {
    const user = {
      name:'weidas',
      title: 'this is react demo',
      age: 13,
      hobbies: ['reading', 'sport']
    }
    return (
      <div>
        <Header user={user} title={this.state.title} />
        <Home age={14} changeTitle={this.onchangeTitle.bind(this)}/>
      </div>

    );
  }
}
export default App

// <div className="container">
//   <div className="row">
//     <div className="col-xs-1 col-xs-offset-11">
//       <Header user={user} title={this.state.title} />
//
//       <Page />
//       <Scroll />
//       <Table />
//     </div>
//   </div>
// </div>
